﻿{% extends "base/index.html" %}


{% block css %}
<link rel="stylesheet" href="/static/css/admin.css">
<link rel="stylesheet" href="/static/ztree3/css/bootstrapStyle/bootstrapStyle.css" type="text/css">
{% endblock %}


{% block center %}



<!--用户信息-->
<div class="panel panel-default center-top" style="min-width:1300px;">
  <div class="panel-heading">
      <div class="row" style="padding-top:5px;padding-left:10px;">
          <div class="col-sm-6">

              <a href="" class="btn btn-sm btn-success" data-toggle="modal" data-target="#idcModal"> 添加机房 </a>

          </div>
      </div>

  </div>
  <div class="panel-body">
        <div style="margin-bottom: 10px;">
            <div class="col-sm-12">
                <table class="table table-hover table-bordered">
                  <thead>
                    <tr style="background-color: #f5f5f5;">
                      <th>ID</th>
                      <th>机房</th>
                      <th>备注</th>
                      <th>联系人</th>
                      <th>电话</th>
                      <th>邮箱</th>
                      <th>操作</th>
                    </tr>
                  </thead>
                  <tbody>
                  {% for i in data_list %}
                    <tr name="tbody">
                      <td>{{ i.id }}</td>
                      <td>{{ i.idc_name }}</td>
                      <td>{{ i.idc_msg }}</td>
                      <td>{{ i.contact }}</td>
                      <td>{{ i.contact_phone }}</td>
                      <td>{{ i.contact_email }}</td>
                      <td style="padding-left:5px;">
                        <a href="javascript:;" style="text-decoration:none;" idc_id="{{ i.id }}" name="edit-idc" data-toggle="tooltip" data-placement="left" title="修改"><span class="fa fa-pencil"></span> </a>&nbsp;&nbsp;&nbsp;
                        <a href="javascript:;" style="text-decoration:none;" idc_id="{{ i.id }}" name="del-idc" data-toggle="tooltip" data-placement="right" title="删除"><span class="fa fa-trash"></span> </a>
                      </td>
                    </tr>
                  {% endfor %}
                  </tbody>
                </table>
                  <div class="text-right" style="margin-top:-30px;padding-right:9%">
                    <ul class="pagination" id="pager">
                      <li class="previous"><a href="/cmdb/idc/1/">首页</a></li>
                      {#上一页按钮开始#}
                      {# 如果当前页有上一页#}
                      {% if data_list.has_previous %}
                      {#  当前页的上一页按钮正常使用#}
                      <li class="previous"><a href="/cmdb/idc/{{ data_list.previous_page_number }}/">上一页</a></li>
                      {% else %}
                      {# 当前页的不存在上一页时,上一页的按钮不可用#}
                      <li class="previous disabled"><a href="javascript:;">上一页</a></li>
                      {% endif %}
                      {#上一页按钮结束#}
                      {# 页码开始#}
                      {% for num in page_list  %}
                          {% if num == currentPage %}
                          <li class="item active"><a href="/cmdb/idc/{{ num }}/">{{ num }}</a></li>
                          {% else %}
                          <li class="item"><a href="/cmdb/idc/{{ num }}/">{{ num }}</a></li>
                          {% endif %}
                      {% endfor %}
                      {#页码结束#}
                      {# 下一页按钮开始#}
                      {% if data_list.has_next %}
                      <li class="next"><a href="/cmdb/idc/{{ data_list.next_page_number }}/">下一页</a></li>
                      {% else %}
                      <li class="next disabled"><a href="javascript:;">下一页</a></li>
                      {% endif %}
                      <li class="previous"><a href="/cmdb/idc/{{ page_nums }}/">尾页</a></li>
                      {# 下一页按钮结束#}
                    </ul>
                  </div>
            </div>
        </div>
  </div>
</div>

{% endblock %}

<!-- Modal -->
{% block modal %}

<div class="modal fade" id="idcModal" tabindex="-1" role="dialog" aria-labelledby="idcModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content" style="margin-top:135px;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="idcModalLabel">添加机房</h4>
      </div>
      <div class="modal-body">
          <div class="form-group">
            <label >机房</label>
            <input  class="form-control"  placeholder="机房" id="idc-name">
          </div>
          <div class="form-group">
            <label >备注</label>
            <input  class="form-control"  placeholder="备注" id="idc-msg">
          </div>
          <div class="form-group">
            <label >联系人</label>
            <input  class="form-control"  placeholder="联系人" id="contact">
          </div>
          <div class="form-group">
            <label >电话</label>
            <input  class="form-control"  placeholder="电话" id="contact-phone">
          </div>
          <div class="form-group">
            <label >邮箱</label>
            <input  class="form-control"  placeholder="邮箱" id="contact-email">
          </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" id="sub-idc">提交</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="edit-idcModal" tabindex="-1" role="dialog" aria-labelledby="edit-idcModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content" style="margin-top:135px;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="edit-idcModalLabel">修改机房</h4>
      </div>
      <div class="modal-body">
          <div class="form-group">
            <label >机房</label>
            <input  class="form-control"  placeholder="机房" id="edit-idc-name">
          </div>
          <div class="form-group">
            <label >备注</label>
            <input  class="form-control"  placeholder="备注" id="edit-idc-msg">
          </div>
          <div class="form-group">
            <label >联系人</label>
            <input  class="form-control"  placeholder="联系人" id="edit-contact">
          </div>
          <div class="form-group">
            <label >电话</label>
            <input  class="form-control"  placeholder="电话" id="edit-contact-phone">
          </div>
          <div class="form-group">
            <label >邮箱</label>
            <input  class="form-control"  placeholder="邮箱" id="edit-contact-email">
          </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" id="sub-edit-idc">提交</button>
      </div>
    </div>
  </div>
</div>
{% endblock  %}
{% block js %}
<script type="text/javascript" src="/static/mystyle/js/asset.js"></script>

{% endblock %}


